<template>
	<div class="Fresh">
		<header><router-link class="mui-icon mui-icon-arrowleft" to="/home">&nbsp;</router-link><a class="title">12349家政上门</a><a>&nbsp;</a></header>
		<dl v-for="lisArr in lisArr">
			<dt><img :src='lisArr.img'></dt>
			<dd>{{lisArr.name}}</dd>
		</dl>
		<footer>
			<img src="../assets/eightimg/12349.jpg">
			<a href="javaScript:;">服务介绍</a>
			<a href="javaScript:;">服务范围</a>
		</footer>
		<div class="ff"></div>
	</div>
</template>
<style scoped>
	.Fresh{
		overflow: hidden;
		width:100%;
	}
	header{
		width:100%;
		height:4rem;
		line-height:4rem;
		background:#e60012;
		font-size:2rem;
		display: flex;
		justify-content: space-around;
	}
	header a{
		color:#fff;
	}
	header .title{
		margin-right:24%;
	}
	.mui-icon-arrowleft{
		margin-top:0.1rem;
		font-size:4rem;
		margin-right:15%;		
	}
	dl{
		float:left;
		width:25%;
		background:#fff;
		overflow: hidden;
		border:1px solid #eeeeee;
	}
	dl dt{
		width:100%;
		background:red;
		height:7.8125rem;
		float:left;
	}
	dl dt img{
		width:100%;
		height:7.8125rem;
	}
	dl dd{
		float:left;
		width:7.8125rem;
		color:#9d9d9d;
		font-size:1.6rem;
		text-align: center;
	}
	footer{
		width:100%;
		overflow: hidden;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	footer img{
		width:100%;
		
	}
	footer a{
		display: inline-block;
		background:#fff;
		color:black;
		width:12rem;
		height:3rem;
		line-height: 3rem;
		font-size:1.8rem;
		text-align: center;
		margin-left:2rem;
	}
	.ff{
		height:10rem;
	}

</style>
<script>
	export default {
		name:'Greens',
		data () {
			return {
				msg: '家政服务',
				lisArr: [
					{img:require("../assets/eightimg/img_1.jpg"),"name":"水电管道"},
					{img:require("../assets/eightimg/img_2.jpg"),"name":"家电维修"},
					{img:require("../assets/eightimg/img_3.jpg"),"name":"家电清洗"},
					{img:require("../assets/eightimg/img_4.jpg"),"name":"锁具服务"},
					{img:require("../assets/eightimg/img_5.jpg"),"name":"空调移机"},
					{img:require("../assets/eightimg/img_6.jpg"),"name":"电脑网络"},
					{img:require("../assets/eightimg/img_7.jpg"),"name":"搬家配送"},
					{img:require("../assets/eightimg/img_8.jpg"),"name":"月嫂"},
					{img:require("../assets/eightimg/img_9.jpg"),"name":"家庭保洁"},
					{img:require("../assets/eightimg/img_10.jpg"),"name":"深度保洁"},
					{img:require("../assets/eightimg/img_11.jpg"),"name":"家电回收"},
					{img:require("../assets/eightimg/img_12.jpg"),"name":"房屋维修"}
				]

			}
		}
	}
</script>
